<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="">
    <meta name="author" content="">
    <title th:text="${news.newsName}"></title>
    <!-- Bootstrap core CSS -->
    <link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>

<body>
<nav th:replace="~{front/log/log_topbar::top}"></nav>
<div class="container" style="margin-top: 80px">
    <div class="row">
        <div class="col-xs-12 col-md-8">
            <h2 style="text-align: center" th:text="${news.newsName}"></h2>
            <input hidden id="newsId" th:value="${news.newsId}">
            <p style="text-align: center; color: #7E7E7E">
                <span>更新时间:</span>
                <span th:text="${news.UpdateTime}"></span>&nbsp;&nbsp;&nbsp;&nbsp;
                <span>来源:</span>
                <span th:text="${news.newsRes}"></span>
            </p>
            <hr>
            <div>
                <!--<p style="font-size: 16px" th:text="${news.newsContent}"></p>-->
                <p style="font-size: 16px" id="rContent"></p>
            </div>
        </div>

        <div class="col-xs-6 col-md-4">
            <p>
                <span class="glyphicon glyphicon-play-circle"></span>
                <span>最新资讯</span>
            </p>
            <div th:each="news:${newsSide}">
                <a style="text-decoration: none" target="_blank" th:href="@{'/logisticsPlatform/news_detail_front?newsId='+${news.newsId}}" th:text="${news.newsName}"></a><br>
            </div>
        </div>
    </div>
</div>

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="../jquery-3.3.1.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script>
    $(function () {
        $("#p1").removeClass("active");
        $("#p2").removeClass("active");
        $("#p3").removeClass("active");
        $("#p4").removeClass("active");
        $('#p6').addClass("active");
    })
</script>

<script>
    var newsContent = document.getElementById("rContent");
    var newsIdValue = $("#newsId").val();
    $.ajax({
        url: "/getNewsContent",
        data: {"newsId" : newsIdValue},
        success: function (data) {
            newsContent.innerHTML = data.data.newsContent.replace(/(\r)*\n/g,"<br/><br/><br/>");
        }
    })

</script>
</body>
</html>